<template>
  <div id="addPatient">
    <van-nav-bar
      title="患者详情"
      left-arrow
      left-text="返回"
      @click-left="onClickLeft"
      class="nav"
      fixed 
      placeholder
    />
    <div class="header">
        <van-field
          maxlength="20"
          :value="form.name == ''? '暂无数据': form.name"
          name="姓名"
          label="姓名"
          readonly
        />
        <van-field name="radio" readonly label="性别">
          <template #input>
            <van-radio-group v-model="form.sex" direction="horizontal">
              <van-radio disabled name="1">男</van-radio>
              <van-radio disabled name="2">女</van-radio>
            </van-radio-group>
          </template>
        </van-field>
        <van-field
          readonly
          clickable
          :value="form.date_age == ''? '暂无数据': (form.date_age || '').split(' ')[0]"
          name="calendar"
          label="出生日期"
        />
        <van-field
          :value="form.tel1 == ''? '暂无数据': form.tel1"
          name="本人电话"
          label="本人电话"
          required
          type="tel"
          readonly
        />
        <van-field
          :value="form.tel2 == ''? '暂无数据': form.tel2"
          name="家属电话"
          label="家属电话"
          :maxlength="11"
          type="tel"
          readonly
          
        />
        <!-- <van-field
          readonly
          clickable
          label="身份证号"
          :value="form.idcard"
          @touchend.native.stop="idcard = true"
          placeholder="请输入患者身份证号"
          :rules="[
            { required: true, message: '请填写患者身份证号！' },
            {
              pattern: /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/,
              message: '身份证号格式错误！'
            }
          ]"
        />
        <van-number-keyboard
          v-model="form.idcard"
          :show="idcard"
          :maxlength="18"
          extra-key="X"
          @blur="idcard = false"
        /> -->
        <van-field
          :value="form.shenfenzheng == ''? '暂无数据': form.shenfenzheng"
          name="身份证号"
          label="身份证号"
          :maxlength="18"
          type="number"
          readonly
          
        />
        <van-field
          :value="form.address1 == ''? '暂无数据': form.address1"
          maxlength="100"
          name="家庭地址"
          label="家庭地址"
          readonly
        />
        <van-field
          :value="form.address2 == ''? '暂无数据': form.address2"
          maxlength="100"
          name="常住地址"
          label="常住地址"
          readonly
        />
        <van-field
          readonly
          clickable
          name="picker"
          :value="form.jibing == ''? '暂无数据': form.jibing"
          label="癌症类型"
        />
       
        <van-field
          readonly
          clickable
          name="picker"
          :value="form.gwname == ''? '暂无数据': form.gwname"
          label="所属医生"
        />
       

    </div>
  </div>
</template>

<script>
import { addPatient } from "@/apis/patient";
export default {
  data() {
    return {
      id:'',
      idcard: false,
      showCalendar: false,
      showYygw: false,
      showAzlx: false,
      Azlx: [],
      Yygw: [],
      gw:[],
      minDate: new Date(1900, 1, 1),
      value: new Date(),
      form: {
        id:'',
        action: "add",
        name: "",
        sex: "1",
        birthday: "",
        tel1: "",
        tel2: "",
        idcard: "",
        addr1: "",
        addr2: "",
        jibing: "",
        gwid: "",
        gwname: ""
      },
      radio:"",
      info:{name:'',id:''}
    };
  },
  methods: {
    tel() {
      console.log(this.form)
    },
    onInput(value) {
      this.$toast(value);
    },
    onDelete() {
      this.$toast("删除");
    },
    onClickLeft() {
      this.$router.go(-1); //返回上一层
    },
    onConfirm(date) {
      this.form.birthday = `${date.getFullYear()}/${date.getMonth() +
        1}/${date.getDate()}`;
      this.showCalendar = false;
      this.form.date_age = this.form.birthday
    },
    onAzlxConfirm(data) {
      this.form.jibing = data.title;
      console.log(data);
      this.showAzlx = false;
    },
    onYygwConfirm(data) {
      let that = this
      this.form.gwname = data.name;
     
      this.gw.forEach(item =>{
        if(that.form.gwname == item.name){
          console.log(item)
          that.form.gwid = item.id
          that.form.gwname = item.name
          if(that.form.gwid>0){
            that.radio = 1
          }else{
            that.radio = 0
          }
           
        }
      })

      this.showYygw = false;
    },
  
    onSubmit() {
      this.form.action = "add"
      this.form.idcard = this.form.shenfenzheng
      this.form.addr1 = this.form.address1
      this.form.addr2 = this.form.address2
      this.form.birthday = this.form.date_age
      addPatient(this.form)
        .then(res => {
          this.$toast("编辑成功");
          this.info.name = this.form.name
          console.log(res)
          this.info.id = res.data.hzid
          this.$router.go(-1); //返回上一层

        })
        .catch(err => {
          if(err.msg){
            this.$toast(err.msg);
          }else{
            this.$toast("网络错误"); 
          }
        });
    },

 
    editPatient () {
       addPatient({action:"list",id:this.form.id})
        .then(res => {
            this.form = res.data.list
            var gwid = res.data.list.yisheng_id
            this.Yygw = res.data.yisheng;
            // this.form.idcard = res.data.list.shenfenzheng
            // this.form.addr1 = res.data.list.address1
            // this.form.addr2 = res.data.list.address2
            // this.form.birthday = res.data.list.date_age
            this.Azlx = res.data.jibing;
            this.Azlx.forEach(item => {
              item.text = item.title;
            });
            this.Yygw.forEach(item=> {
              item.text = item.name;

              if(gwid == item.id){
               this.form.gwname = item.name
              }
            })
            if(gwid>0){
                this.radio = 1
            }else{
              this.radio = 0
            }
            // console.log(this.form.gwname)  
        })
        .catch(err => {
          if(err.msg){
            this.$toast(err.msg);
          }else{
            this.$toast("网络错误"); 
          }
        });
    }
  },
  mounted() {
    this.editPatient()
    
   
  },
  created() {
      this.id = this.$route.params.id;
      this.form.id = parseInt(this.$route.params.id)
      console.log(this.form.id)
  },
  watch: {
    "form.gwid": {
      deep: true,
      handler: function(newV, oldV) {
        if (newV === "0") {
          this.form.gwname = "";
        }
      }
    }
  }
};
</script>

<style lang="less">
#addPatient {
  padding-bottom: 60px;
  .van-nav-bar{
    background-color: #ededed;
  }
  .nav {
    .van-icon,.van-nav-bar__text {
      color: #404040;
    }
  }
  .yygw {
    &.van-cell {
      .van-cell__title {
        width: 150px;
      }
    }
  }

  .save {
    background-color: #fff;
    padding: 30px 20px;
    margin: 16px 0;
    text-align:left;
     .code {
      margin-bottom: 15px;
      font-size: 16px;
      font-weight: 500;
      i {
        display: inline-block;
        width: 13px;
        height: 13px;
        border-radius: 50%;
        background-color: #fa5b57;
      }
    }
  }
    .van-radio__icon--disabled .van-icon {
        background-color: #fff;
    }
   .van-radio__icon--disabled.van-radio__icon--checked .van-icon{
    background-color: #1989fa;
    border-color: #1989fa;
    }
    .van-radio__icon--disabled.van-radio__icon--checked .van-icon {
        color: #fff;
    }
}
</style>
